HC: make selected items better visible

- follow libadwaita's example and outline selected items for better visibility
  in high contrast variant

Fixes https://gitlab.gnome.org/GNOME/gtk/-/issues/4984

diff --git a/gtk/theme/Default/_common.scss b/gtk/theme/Default/_common.scss
index 0d992641f757b1dfe86463ce68fc62be166d0dca..077eabc30bc76db61341ab2a855ae99c3dcef23d 100644 (file)
--- a/gtk/theme/Default/_common.scss
+++ b/gtk/theme/Default/_common.scss
@@ -89,6 +89,13 @@ iconview {
 
   @include focus-ring();
 
+  @if $contrast == 'high' {
+    &:selected {
+      box-shadow: inset 0 0 0 1px $borders_color;
+    }
+  }
+
+
   &:drop(active) {
     box-shadow: none;
   }
@@ -135,6 +142,11 @@ gridview {
       outline-color: $alt_focus_border_color;
 
       @extend %selected_items;
+
+      @if $contrast == 'high' {
+        box-shadow: inset 0 0 0 1px $borders_color;
+      }
+
     }
 
     box { //cells
@@ -1947,7 +1959,13 @@ popover.menu {
       outline: none;
       transition: none;
 
-      &:selected { background: image($menu_selected_color); }
+      &:selected {
+        background: image($menu_selected_color);
+
+        @if $contrast == 'high' {
+          box-shadow: inset 0 0 0 1px $borders_color;
+        }
+      }
     }
   }
 
@@ -3624,6 +3642,11 @@ separator.sidebar {
       background-color: $menu_selected_color;
       color: inherit;
 
+      @if $contrast == 'high' {
+        box-shadow: inset 0 0 0 1px $borders_color;
+      }
+
+
       &:hover {
         background-color: darken($menu_selected_color,5%);
       }
@@ -4269,6 +4292,10 @@ popover.emoji-picker emoji {
   &:focus,
   &:hover {
     background: $selected_bg_color;
+
+    @if $contrast == 'high' {
+      box-shadow: inset 0 0 0 1px $borders_color;
+    }
   }
 }